var initBoxs = function() {
	getBoxs();
}

var getBoxs = function() {
	// indicate loading
	ajaxRequest('GET', encodeURI('UserBoxController'), {
		'Accept': 'application/json'
	}, null, function(status, headers, body) { // success callback
		// update html
		var listEl = document.getElementById('list-area');
		var boxs = eval('(' + body + ')');
		if(boxs.length == 0) {
			listEl.innerHTML = '<div class="list-no-box">There is no mail here!</div>';
			return;
		}
		var htmlFrag = '';
		for(var i = 0; i < boxs.length; i++) {
			htmlFrag += '<div class="list-mail">'
					+ '<div class="list-mail-id">' + boxs[i].id + '</div>'
					// escape in case title and text contain chars sensitive to HTML parsing
					+ '<div class="list-mail-title">' + escapeHtml(unescape(boxs[i].name)) + '</div>'
					+ '<div class="list-mail-text">' + escapeHtml(unescape(boxs[i].content)) + '</div>'
					+ '<div class="list-mail-stamp">' + new Date(boxs[i].stamp).toUTCString().split(/(GMT|UTC)/i)[0] + '</div>'
					+ '</div>';
		}
		listEl.innerHTML = htmlFrag;

		var boxEl = listEl.firstChild;
		while(boxEl) {
			boxEl.onmouseover = function(el) {
				return function() { // closure
					addClass(el, 'list-mail-over');
				};
			}(boxEl);
			boxEl.onmouseout = function(el) {
				return function() { // closure
					removeClass(el, 'list-mail-over');
				};
			}(boxEl);
			boxEl = boxEl.nextSibling;
		}


        	}, function(status, headers, body) {  // error callback
		alert('error: ' + status);
	}, null); // run callbacks in global scope  */

}



